<template>
    <div>
      <el-dialog
      title="人员详情"
      :visible="visible"
      :before-close="handleClose"
     >
<div class="top">
  <div class="xq">
    <p>人员名称：{{ data.userName}}</p>
    <p>角色：{{ data.roleName }}</p>
    <p>联系电话：{{ data.mobile }}</p>
  </div>
  <div class="area">
    <p>负责区域：{{ data.regionName }}</p>
  </div>
</div>
<el-table  :data='list1'  border style="width: 100%">
  <el-table-column prop="date" label=""> </el-table-column>
  <el-table-column prop="total" label="总工单数"> </el-table-column>
  <el-table-column prop="cancelCount" label="拒绝工单">
  </el-table-column>
  <el-table-column prop="workCount" label="完成工单"> </el-table-column>
  <el-table-column prop="progressTotal" label="进行中工单">
  </el-table-column>
</el-table>
</el-dialog>
    </div>
</template>

<script>
export default {
    props: {
     visible:true,
     data:{
      type:Object,
      default:() => ({})
     },
     list1:{
      type:Array,
      default:() => []
     }
    },
    data() {
        return {
          
        };
    },
   
    methods: {
      handleClose(){
        this.$emit('update:visible',false)
      }
    },
    
};
</script>

<style scoped lang="scss">
.top {
  height: 100px;
  padding: 15px 19px 0;
  background: #f3f6fb;
  font-size: 14px;
  color: #666666;
  margin-bottom: 15px;
  .xq {
    display: flex;
    justify-content: space-between;
    // margin-bottom: 12px;
  }
  .area {
    margin-top: 10px;
  }
}
::v-deep .el-input__inner {
  width: 200px;
}
::v-deep .el-button--primary {
  margin-left: 15px !important;
}
</style>
